<div>
    <ol class="breadcrumb" >
        <li> <i class="fa fa-anchor"></i>
            &nbsp;大数据统计
        </li>
        <li>预约记录统计</i></li>
        <li style="float: right"><a  href="javascript:history.go(-1);">返回</a></li>
    </ol>
    <div class="panel">
        <div class="panel-heading" >
            <i class="fa fa-list"></i>
            &nbsp;&nbsp;统计信息表<strong>【{$pro}】</strong>
        </div>
        <div class="panel-body search-panel-body retract">
            <div class="col-xs-2 search-col " style="width:135px">
                <div class="input-group">
                    <select id="elect"  class="form-control" style="background:#ccc;">
                        <option  value="1">按年份选择</option>
                        <option  value="2">按月份选择</option>
                        <option  value="3">按时间段选择</option>
                    </select>
                </div>
            </div>
            <!-- 按年 -->
            <if condition="$_GET['char_id'] neq Null">
                <form class="search-form year" action="__URL__/evchar_charge/char_id/{$_GET['char_id']}" method="get">
                    <elseif condition="$_GET['id'] neq Null" />
                    <form class="search-form year" action="__URL__/bespeak_pro/id/{$_GET['id']}" method="get">
            </if>
            <div class="col-xs-2 search-col ">
                <div class="input-group">
                    <input type="text" class="form-control  form_month2" placeholder="点击选择年" name="year" value="{$_GET['year']}"  data-date-format="yyyy" data-link-format="yyyy">
                </div>
            </div>
            <div class="col-xs-1 search-col">
                <button  type="submit" class="btn btn-warning">
                    <i class="fa fa-search"></i>
                    &nbsp;搜索
                </button>
            </div>
            </form>
            <!-- 按月 -->
            <if condition="$_GET['char_id'] neq Null">
                <form class="search-form month hide" action="__URL__/evchar_charge/char_id/{$_GET['char_id']}" method="get">
                    <elseif condition="$_GET['id'] neq Null" />
                    <form class="search-form month hide" action="__URL__/bespeak_pro/id/{$_GET['id']}" method="get">
            </if>
            <div class="col-xs-2 search-col">
                <div class="input-group">
                    <input type="text" class="form-control  form_month1" placeholder="点击选择月" name="month" value="{$_GET['month']}"  data-date-format="yyyy-mm" data-link-format="yyyy-mm">
                </div>
            </div>
            <div class="col-xs-1 search-col">
                <button  type="submit" class="btn btn-warning">
                    <i class="fa fa-search"></i>
                    &nbsp;搜索
                </button>
            </div>
            </form>
            <!-- 按时间段 -->
            <if condition="$_GET['char_id'] neq Null">
                <form class="search-form times hide" action="__URL__/evchar_charge/char_id/{$_GET['char_id']}" method="get">
                    <elseif condition="$_GET['id'] neq Null" />
                    <form class="search-form times hide" action="__URL__/bespeak_pro/id/{$_GET['id']}" method="get">
            </if>
            <div class="col-xs-4 search-col">
                <div class="input-group">
                    <input type="hidden" name="code" value="{$_GET['code']}"/>
                    <input type="text" class="form-control  form_month" placeholder="点击选择" name="start_time" value="{$_GET['start_time']}"  data-date-format="yyyy-mm-dd" data-link-format="yyyy-mm-dd">
                    <span class="input-group-addon">~~</span>
                    <input type="text" class="form-control  form_month" placeholder="点击选择" value="{$_GET['end_time']}" name="end_time"  data-date-format="yyyy-mm-dd" data-link-format="yyyy-mm-dd">
                </div>
            </div>
            <div class="col-xs-1 search-col">
                <button  type="submit" class="btn btn-warning">
                    <i class="fa fa-search"></i>
                    &nbsp;搜索
                </button>
            </div>
            </form>
            <if condition="$_GET['char_id'] neq Null"><elseif condition="$_GET['id'] neq Null" />
                <div class="col-xs-1 search-col">
                    <button id="site"  type="button" class="btn btn-warning">
                        <i class="fa fa-bar-chart-o"></i>
                        &nbsp;电桩统计
                    </button>
                </div>
            </if>
        </div>
    </div>

    <table  class="table table-bordered table-mcit" >
        <thead>
        <tr>
            <th >
                <empty name="countBills">
                    <button class='btn btn-block btn-mcit' type='button' style="text-align:center" > <strong><i class="fa fa-meh-o"></i>
                        &nbsp;&nbsp;当前条件下没有汇总数据</strong>
                    </button>
                <else />
                    <button class='btn btn-block btn-mcit' type='button' >{$node}</button>
                    <button class='btn btn-block btn-mcit' type='button' >
                        <volist name="countBills" id="datas">
                            &nbsp;&nbsp;<span>总计：&nbsp;{$datas.total}次</span>
                            &nbsp;&nbsp;<span>总时长：&nbsp;{$datas.bespeak_time}</span>
                            &nbsp;&nbsp;<span>总预约费：&nbsp;{$datas.bespeak_fee}元</span>
                        </volist>
                    </button>
                </empty>
            </th>
        </tr>
        </thead>
    </table>

    <table  class="table table-bordered table-striped table-mcit" >
        <thead>
        <tr>
            <th>
                <button class='btn btn-block btn-mcit'>记录时间</button>
            </th>
            <th>
                <button class='btn btn-block btn-mcit'>预约总次数</button>
            </th>
            <th>
                <button class='btn btn-block btn-mcit'>预约总时长</button>
            </th>
            <th>
                <button class='btn btn-block btn-mcit'>预约费</button>
            </th>
            <if condition="$_GET['char_id'] neq Null">
                <!--<th>
                    <button class='btn btn-block btn-mcit'>操作</button>
                </th>-->
                <elseif condition="$_GET['id'] neq Null" /></if>
        </tr>
        </thead>
        <tbody id="DataTableContent">
        <empty name="site_charge">
            <td colspan="99" style="text-align:center" class="danger"> <strong><i class="fa fa-meh-o"></i>
                &nbsp;&nbsp;当前条件下没有数据</strong>
            </td>
            <else />
            <volist name="site_charge" id="data">
                <tr align="center">
                    <td>{$data.currentTime}</td>
                    <td><if condition="$data.total neq null">{$data.total}<else />0</if></td>
                    <td><if condition="$data.bespeak_time neq null">{$data.bespeak_time}<else />0小时0分0秒</if></td>
                    <td><if condition="$data.bespeak_fee neq null">{$data.bespeak_fee}<else />0.00</if></td>
                    <if condition="$_GET['char_id'] neq Null">
                        <!--<td>
                            <a class="btn btn-success btn-sm" href="__APP__/Stateistics/bespeak_list/key_link/{$key_link}/times/{$data.currentTime}">
                                <i class="fa fa-eye"></i>
                                &nbsp;详情
                            </a>
                        </td>-->
                        <elseif condition="$_GET['id'] neq Null" /></if>
                </tr>
            </volist>
        </empty>
        <tr>
            <td colspan="99" style="text-align:center">
                <ul class="pagination">{$pageView}</ul>
            </td>
        </tr>
        </tbody>
    </table>
</div>
</div>
<import type='css' file="css.datetimepicker" />
<import file="js.bootstrap-datetimepicker#min" />
<import file="js.bootstrap-datetimepicker#zh-CN" />
<import file="js.maskedinput" />
<script type="text/javascript">
    $(document).ready(function () {
        //时间段
        $(".form_month").datetimepicker({
            language: 'zh-CN',
            autoclose: true,
            startView:'month',
            minView: 'month',
            todayBtn: true,
            viewSelect: 'year',
            pickerPosition: "bottom-right"
        });
        //按月
        $(".form_month1").datetimepicker({
            language: 'zh-CN',
            autoclose: true,
            startView:'year',
            minView: 'year',
            todayBtn: false,
            viewSelect: 'year',
            pickerPosition: "bottom-right"
        });
        //按年
        $(".form_month2").datetimepicker({
            language: 'zh-CN',
            autoclose: true,
            startView:'decade',
            minView: 'decade',
            todayBtn: false,
            viewSelect: 'decade',
            pickerPosition: "bottom-right"
        });
        //搜索表单切换
        $("#elect").bind("change",function(){
            var tab_id = $(this).val();
            if(tab_id == 1){
                $(".year").removeClass("hide");
                $(".month").addClass("hide");
                $(".times").addClass("hide");
            }else if(tab_id == 2){
                $(".year").addClass("hide");
                $(".month").removeClass("hide");
                $(".times").addClass("hide");
            }else if(tab_id == 3){
                $(".year").addClass("hide");
                $(".month").addClass("hide");
                $(".times").removeClass("hide");
            }
        });
        //站点统计
        $("#site").click(function(){
            window.location.href = "__URL__/bespeak_area/ev_plant_id/{$_GET['id']}";
        });
    });
</script>